<template>
  <div class="app">
    <div class="header" v-if="shouldShowTopBar">
      <TopBar />
    </div>
    <div class="content" v-bind:style="contentStyle">
      <router-view/>
    </div>
  </div>
</template>
<script>
import TopBar from './layouts/TopBar/index.vue'
export default {
  name: 'App',
  components: {
    TopBar
  },
  computed: {
    shouldShowTopBar() {
      // 根据当前路由来决定是否显示 TopBar
      // 例如，如果路由是 '/coolHome'，则不显示 TopBar
      return this.$route.path !== '/coolHome';
    },
    contentStyle() {
      // 根据当前路由来决定是否需要调整样式
      if (this.$route.path === '/coolHome') {
        return {
          top: '0px'
        };
      } else {
        return {
          top: '-58px'
        };
      }
    }
  }
}
</script>
<style lang="scss">
  .app {
  height: 100vh;
  width: 100vw;
  background: url("./assets/images/header/u0_state0.jpg") no-repeat center center;
  background-size: cover;
  }
  .content {
  position: relative;
  // top: -58px;
  /* 根据需要调整这个值 */
}
</style>
